<template>
  <div>
    <div id="head">
      <!-- 电影图片栏    -->
      <div id="movie-header">
        <img id="pic" src="https://p1.meituan.net/movie/967b253953bc7e660cfadbf9d78f67b62852693.jpg@464w_644h_1e_1c">
        <!--电影简介 -->
        <div id="box1">
          <h1>误杀</h1>
          <span>导&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;演:&nbsp;王晶</span><br>
          <span>领衔主演:&nbsp;周润发、谢霆锋、景甜</span><br>
          <span>类&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;型:&nbsp;剧情,犯罪</span><br>
          <span>国家/地区:&nbsp;中国</span><br>
          <span>片&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;长:&nbsp;150&nbsp;分钟</span><br>
          <span>语&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;言:&nbsp;中文</span><br>
        </div>
      </div>
      <div id="box2">
        <el-button  id="butt1" class="butt" @click="tobuy">排片购票</el-button>
        <el-button  class="butt" id="butt2" @click="moviesIntroduce">影片介绍</el-button>
        <!--                    <router-link to="" class="butt" to="/toSellingTis">排片购票</router-link>-->
        <!--                    <router-link to="" class="butt">影片介绍</router-link>-->
        <hr style="background-color: #409EFF; margin-top: -1px;color: blue;margin-left: 100px;height: 3px">
      </div>
      <!-- 观影时间       +           买票页 -->

    </div>
    <div id="body">
      <router-view></router-view>
    </div>
  </div>
</template>

<script>


    export default {
        name: "BuyTicket",
        data(){
            return{
                id:'',
            }
        },
        methods: {
            getInfor(id){
                this.axios({
                    url:''
                }).then(function (res) {

                })
            },
            tobuy(){
                this.$router.push('/showTicTimes')
            },
            moviesIntroduce(){
                this.$router.push('/movieInfors')
            }

        },
        created(){
            var id = this.$route.params.id;
            this.tobuy();
            this.getInfor(id);
        }

    }
</script>

<style scoped>
  #box2{
    border: 1px solid blue;
    margin-top: 60px;
  }
  #head{
    width: 1365px;
    height: 460px;
    border: 1px solid black;
    margin-left: 20px;
    margin-top: -20px;
  }
  #movie-header{
    background: url("/static/moviePic/picback-grand.jpg");
    width: 1365px;
    height: 380px;
    /*margin-left: 20px;*/
    margin-top: -20px;
    border: red 1px solid;
    background-size:cover;
    color: white;
    font-family:微软雅黑;
  }
  #body{
    width: 1365px;
    height: 500px;
    margin-left: 20px;
    margin-top: 20px;
    border: red 1px solid;
  }
  #pic{
    width: 240px;
    height: 340px;
    float: left;
    margin-left: 100px;
    margin-top: 60px;
    border: white 5px solid;
  }
  #box1{
    float: left;
    width: 800px;
    height: 300px;
    border: 1px solid red;
    margin-top: 60px;
    margin-left: 30px;
  }
  h1{
    margin-top: -2px;
  }
  #box1 span{
    line-height: 40px;
  }
  #butt1{
    margin-left: 100px;
  }
  #butt2{
    margin-left: -6px;
  }
  .butt{
    width: 160px;
  }
</style>
